<span class="username">
{{ template "layout/header" .}}
<link href="http://cdn.bootcss.com/highlight.js/8.0/styles/monokai_sublime.min.css" rel="stylesheet">
<script src="/static/js/ck5b/ckeditor.js"></script>
<script src="http://cdn.bootcss.com/highlight.js/8.0/highlight.min.js"></script>
<script >hljs.initHighlightingOnLoad();</script>

<main id="body">
    <div class="container">
        <div class="row">
            <div class="col-lg-9 main">
                {{ template "layout/emailcheck" .}}
                <ol class="breadcrumb d-none d-md-flex">
                    <li class="breadcrumb-item"><a href="/" aria-label="首页"><i class="icon-home"></i></a></li>
                    <li class="breadcrumb-item"><a href="/forum/{{.thread.ForumID}}/list.html">{{.thread.Forum.Name}}</a></li>
                    <li class="breadcrumb-item active"><a href="#" title="{{.thread.Subject}}">{{.thread.Subject}}</a></li>
                </ol>
                <div class="card card-thread">
                    <div class="card-body">
                        <div class="media">
                            <a href="?user-1.htm" tabindex="-1">
                                <img class="avatar-3 mr-3" src="{{.thread.User.Avatar}}">
                            </a>
                            <div class="media-body">
                                <h4 class="break-all">
                                    {{.thread.Subject}}
                                </h4>
                                <div class="d-flex justify-content-between small">
                                    <div>
                                        <span class="username">
                                            <a href="?user-1.htm" class="text-muted font-weight-bold">{{.thread.User.Username}}</a>
                                        </span>
                                        <span class="date text-grey ml-2">
                                            {{.thread.CreatedAt.Unix | strtime}}
                                        </span>
                                        <span class="text-grey ml-2">
                                            <i class="icon-eye"></i>
                                            {{.thread.ViewsCnt}}
                                        </span>
                                    </div>
                                    {{/*如果是作者本人操作*/}}
                                    {{/*{{if islogin}}*/}}
                                    {{if eq .fpost.UserID .sessions.Userid}}
                                        <div>
                                        <a href="/thread/{{.thread.ID}}/edit.html" class="text-grey mr-2 post_update"><i class="icon-edit"></i> 编辑</a>
                                        <a data-href="/thread/{{.thread.ID}}/delete.html" href="javascript:void(0);" class="text-grey post_delete" isfirst="1"><i class="icon-remove"></i> 删除</a>
                                    </div>
                                    {{end}}
                                    {{/*{{end}}*/}}
                                </div>
                            </div>
                        </div>
                        <hr>
                        <div style="overflow-x: scroll;" class="message break-all" isfirst="1">
                            {{.fpost.Message | unescaped}}
                            {{/*{{.attachsdddd}}*/}}
                        </div>
                        {{if .attachs}}
                            <fieldset class="fieldset">
                                <legend>上传的附件：</legend>
                                <ul class="attachlist">
                                    {{range .attachs}}
                                        <li aid="{{.ID}}">
                                            <a href="/{{.Filename}}" target="_blank">
                                                <i class="icon filetype {{.Filetype}}"></i>
                                                {{.Orgfilename}}
                                            </a>
                                        </li>
                                    {{end}}
                                </ul>
                            </fieldset>
                        {{end}}
                        <div class="plugin d-flex justify-content-center mt-3">
                            <style>
                                .haya-favoriter {
                                    position: relative;
                                }
                                .haya-favorite-show-users {
                                    position: absolute;
                                    top: 5px;
                                    z-index: 100;
                                    width: 100%;
                                }
                                .haya-favorite-show-users .haya-favorite-users {
                                    max-height: 250px;
                                    overflow-y: auto;
                                }
                            </style>
                            <div class="haya-favoriter px-2">
                                {{if .islogin}}
                                    <span class="btn-group haya-favoriter-info" role="group">
                                    {{if .isfav}}
                                        <button onclick="myfavourite({{.thread.ID}}, this)" class="btn btn-outline-secondary js-haya-favorite-del" data-tid="{{.thread.ID}}" title="取消收藏">
                                            <i class="icon icon-star" aria-label="取消收藏"></i>
                                            <span class="haya-favorite-btn">取消</span>
                                        </button>
                                    {{else}}
                                        <button onclick="myfavourite({{.thread.ID}}, this)" class="btn btn-outline-secondary js-haya-favorite-tip" data-tid="{{.thread.ID}}" title="收藏本帖">
                                            <i class="icon icon-star-o" aria-label="收藏本帖"></i>
                                            <span class="haya-favorite-btn">收藏</span>
                                        </button>
                                    {{end}}
                                    <button class="btn btn-outline-secondary js-haya-favorite-show-users" data-tid="{{.thread.ID}}" title="点击查看收藏详情">
                                        <span class="haya-favorite-user-count">{{.thread.FavouriteCnt}}</span>
                                    </button>
                                </span>
                                {{else}}<span class="btn-group haya-favoriter-info" role="group">
                                    <button onclick="$.alert('首先请登录')" class="btn btn-outline-secondary js-haya-favorite-tip" data-tid="{{.thread.ID}}" title="收藏本帖">
                                        <i class="icon icon-star-o" aria-label="收藏本帖"></i>
                                        <span class="haya-favorite-btn">收藏</span>
                                    </button>
                                    <button class="btn btn-outline-secondary js-haya-favorite-show-users" data-tid="{{.thread.ID}}" title="点击查看收藏详情">
                                        <span class="haya-favorite-user-count">{{.thread.FavouriteCnt}}</span>
                                    </button>
                                </span>
                                {{end}}
                            </div>
                        </div>
                    </div>
                </div>

                <div class="card card-postlist">
                    <div class="card-body">
                        <div class="card-title">
                            <div class="d-flex justify-content-between">
                                <div>
                                    <b>最新回复</b> (<span class="posts">{{.post_list_len}}</span>)
                                </div>
                                <div>
                                </div>
                            </div>
                        </div>
                        <ul class="list-unstyled postlist">
                            {{$isadmin := .session.Isadmin}}
                            {{range $index,$post := .postlist}}
                                <li class="media post" data-pid="2" data-uid="2">
                                <a href="/user/{{$post.User.ID}}/info.html" class="mr-3" tabindex="-1">
                                    <img class="avatar-3" src="{{$post.User.Avatar}}">
                                </a>
                                <div class="media-body">
                                    <div class="d-flex justify-content-between small text-muted">
                                        <div>
                                            <span style="padding-bottom:0;margin-bottom:0;color:; ">
                                                <i class="iconfont icon-v1" style="font-size: !important;">
                                                    {{$post.User.Group.Name}} </i>
                                            </span>
                                            <span class="username">
                                                <a href="/user/{{$post.UserID}}/info.html" class="text-muted font-weight-bold">{{$post.User.Username}}</a>
                                            </span>
                                            {{/*<span class="date text-grey ml-2">{{$post.CreatedAt.Format "2006-01-02 15:04:05"}}</span>*/}}
                                            <span class="date text-grey ml-2">{{$post.CreatedAt.Unix | strtime}}</span>
                                        </div>
                                        <div class="text-right text-grey">
                                            <style>
                                                .haya-post-like .haya-post-like-loved {
                                                    color: var(--secondary) !important;
                                                }
                                            </style>

                                            <span class="floor-parent">
                                                <span class="floor mr-0">{{$index | plus1}}</span>楼
                                            </span>
                                        </div>
                                    </div>
                                    <div class="message mt-1 break-all">
                                        {{$post.Message | unescaped}}
                                    </div>
                                    {{if $post.FilesNum}}
                                        <fieldset class="fieldset">
                                            <legend>上传的附件：</legend>
                                            {{$attach := $post.Attach}}
                                            <ul class="attachlist">
                                                {{range $attach}}
                                                    <li aid="{{.ID}}">
                                                        <a href="?attach-download-24.htm" target="_blank">
                                                            <i class="icon filetype {{.Filetype}}"></i>
                                                            {{.Orgfilename}}
                                                        </a>
                                                    </li>
                                                {{end}}
                                            </ul>
                                        </fieldset>
                                    {{end}}
                                </div>
                            </li>
                            {{end}}

                            {{if .sessions.Username}}
                                <li class="post newpost media">
                                <a href="/my.html" class="mr-3" tabindex="-1">
                                    <img class="avatar-3" src="{{.sessions.Useravatar}}">
                                </a>
                                <div class="media-body">
                                    <div class="d-flex justify-content-between small text-muted">
                                        <div>
                                            <div>{{.sessions.Username}}</div>
                                        </div>
                                        <div>
                                            <span class="floor" id="newfloor">回复</span>上楼 </div>
                                    </div>
                                    <div>
                                        <form action="/api/v1/thread/{{.thread.ID}}/post" method="post" id="quick_reply_form" class="d-block">
                                            <input type="hidden" id="quotetid" name="threadid" value="{{.thread.ID}}">
                                            <input type="hidden" id="docutype" name="docutype" value="0">
                                            <div class="message mt-1">
                                                <textarea class="form-control" id="editor1" placeholder="内容" name="message"></textarea>
                                            </div>
                                            {{/*<br>*/}}
                                            {{ template "layout/captcha" .}}
                                            <div class="text-muted mt-2 small">
                                                <div class="d-flex justify-content-between">
                                                    <div>
                                                        <button id="postsubmit" type="button" class="btn btn-sm btn-secondary" id="submit" data-loading-text="正在提交..."> 回帖 </button>
                                                    </div>
                                                    <div>
                                                        <a class="icon-mail-forward text-muted" href="#" id="advanced_reply"> 高级回复</a>
                                                    </div>
                                                </div>
                                            </div>
                                        </form>
                                    </div>
                                </div>
                            </li>
                            {{else}}
                                <li class="post newpost media">
                                <a role="button" class="btn btn-default btn-block xn-back col-lg-6 mx-auto mb-3" target="_blank" href="/login.html">登录可回复</a>
                            </li>
                            {{end}}
                        </ul>
                    </div>
                </div>
                <div class="d-none threadlist"><input type="checkbox" name="modtid" value="2" checked=""></div>
                {{if .islogin}}
                    {{ template "mod/thread_list_mod.inc" .}}
                {{end}}
                <a role="button" class="btn btn-secondary btn-block xn-back col-lg-6 mx-auto mb-3" href="javascript:history.back();">返回</a>
            </div>
            <div class="col-lg-3 d-none d-lg-block aside">
                {{ template "layout/addnewthread" .}}
                {{/*用户信息*/}}
                <div class="card card-user-info">
                    <div class="m-3 text-center">
                        <a href="?user-1.htm" tabindex="-1">
                            <img class="avatar-5" src="{{.thread.User.Avatar}}">
                        </a>
                        <h5><a href="/user/{{.thread.User.ID}}/info.html">{{.thread.User.Username}}</a></h5>
                    </div>
                    <div class="card-footer p-2">
                        <table class="w-100 small">
                            <tbody>
                                <tr align="center">
                                    <td>
                                        <span class="text-muted">主题数</span><br>
                                        <b>{{.thread.User.ThreadsCnt}}</b>
                                    </td>
                                    <td>
                                        <span class="text-muted">帖子数</span><br>
                                        <b>{{.thread.User.PostsCnt}}</b>
                                    </td>
                                    <td>
                                        <span class="text-muted">精华数</span><br>
                                        <b>{{.thread.User.DigestsCnt}}</b>
                                    </td>
                                    <td>
                                        <span class="text-muted">注册排名</span><br>
                                        <b>{{.thread.User.ID}}</b>
                                    </td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                </div>
                {{/*搜索框*/}}
                <div class="form-group">
                    <div id="search_form">
                        <div class="input-group mb-3">
                            <input type="text" class="form-control" placeholder="关键词" name="keyword">
                            <div class="input-group-append">
                                <button class="btn btn-primary" type="button" id="searchbutton">搜索</button>
                            </div>
                        </div>
                    </div>
                </div>
                {{/*用户的列表*/}}
                <div class="card">
                    <div class="card-body">
                        <h6 class="card-title">作者最近主题：</h6>
                        <ul class="small break-all">
                            {{range .user_newest_threads}}
                                <li class="line-height-2">
                                <a href="/thread/{{.ID}}/detail.html">
                                    {{.Subject}}
                                </a>
                            </li>
                            {{end}}

                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </div>
</main>


{{.isfav}}

<script>
var myeditor = null;
ClassicEditor.create(document.querySelector('#editor1'), {
    language: 'zh-cn',
    image: {
        toolbar: [
            'imageTextAlternative',
            'imageStyle:full',
            'imageStyle:side'
        ]
    },
    table: {
        contentToolbar: [
            'tableColumn',
            'tableRow',
            'mergeTableCells'
        ]
    },
    licenseKey: '',
    ckfinder:{
        'uploadUrl':'/api/v1/image/upload',
    },

})
    .then(editor => {
        myeditor = editor
    })
    .catch(error => {
        console.error('Oops, something went wrong!');
        console.error(error);
    });


var qrform = $("#quick_reply_form")
var jsubmit = $('#postsubmit');
jsubmit.on('click', function() {
    if ({{.islogin}} && {{.sessions.EmailChecked}} == "0") {
        $.alert("您的邮箱还没有验证，无法回帖")
        return
    }

    if (myeditor.getData().length == 0) {
        $.alert("亲，写点什么再提交吧 ^_^")
        return;
    }

    // 验证验证码
    var captcha = getCaptcha()
    var captchaKey = getCaptchaKey()
    captchaPass = virefyCaptcha(captcha, captchaKey)
    if (captcha.length == 0) {
        $.alert("验证码不能为空")
        return
    } else {
        if (captchaPass != 200 ) {
            $.alert("验证码错误")
            refreshCaptcha();
            return
        }
    }

    qrform.reset();
    jsubmit.button('loading');
    var postdata = qrform.serializeObject();
    postdata.message = myeditor.getData();
    console.log(postdata)

    $.xpost(qrform.attr('action'), postdata, function(code, message) {
        console.log(code, ":", message)
        if(code == 200) {
            $.alert("回复成功")
            setTimeout(function () {
                // addNewPostElement()
                location.reload()
            }, 2000)
        } else if(code < 0) {
            $.alert(message);
            jsubmit.button('reset');
        } else {
            jform.find('[name="'+code+'"]').alert(message).focus();
            jsubmit.button('reset');
        }
    });

    return false;
});

function addNewPostElement() {
    var jsubmit = $('#postsubmit')
    var s = '<ul>' +
        '<li class="media post" data-pid="5" data-uid="2">' +
        '<a href="?user-2.htm" class="mr-3" tabindex="-1">' +
        '<img class="avatar-3" src="upload/avatar/000/2.png?1563802634"> ' +
        '</a>' +
        '<div class="media-body">' +
        '<div class="d-flex justify-content-between small text-muted">' +
        '           <div> ' +
        '<span style="padding-bottom:0;margin-bottom:0;color:; ">' +
        '<i class="iconfont icon-v1" style="font-size: !important;">管理员组 </i> ' +
        '</span>' +
        '<span class="username">' +
        '<a href="?user-2.htm" class="text-muted font-weight-bold">zhang</a>' +
        '</span>' +
        '<span class="date text-grey ml-2">2小时前</span>' +
        '</div> ' +
        '<div class="text-right text-grey"> ' +
        '<style>.haya-post-like .haya-post-like-loved {color: var(--secondary) !important;}</style> ' +
        '<span class="haya-post-like mr-3"> ' +
        '<a href="javascript:;" class="text-muted js-haya-post-like-post-add" data-pid="5" title="点赞回复">' +
        '<i class="icon icon-thumbs-o-up" aria-label="点赞回复"></i> ' +
        '<span class="haya-post-like-post-user-count">0</span>' +
        '</a>' +
        '</span>' +
        '<a href="javascript:void(0)" data-tid="1" data-pid="5" class="text-grey post_reply mr-3">' +
        '<i class="icon-reply" title="引用"></i> ' +
        '<span class="d-none">引用</span>' +
        '</a> ' +
        '<a href="?post-update-5.htm" class="text-grey post_update mr-3">' +
        '<i class="icon-edit" title="编辑"></i> ' +
        '<span class="d-none">编辑</span>' +
        '</a> ' +
        '<a data-href="?post-delete-5.htm" data-confirm-text="确定删除吗？" href="javascript:void(0);" class="text-grey post_delete _confirm mr-3">' +
        '<i class="icon-remove" title="删除"></i> ' +
        '<span class="d-none">删除</span>' +
        '</a> ' +
        '<span class="floor-parent"> ' +
        '<span class="floor mr-0">5</span>楼 ' +
        '</span>' +
        '</div>' +
        '</div>' +
        '<div class="message mt-1 break-all"><p>玩儿翁</p> ' +
        '</div>' +
        '</div> ' +
        '</li>' +
        '</ul>';

    var jli = $(s).find('li');
    jli.insertBefore($('.postlist > .post').last());
    jsubmit.button('reset');

    // 楼层 +1
    var jfloor = $('#newfloor');
    jfloor.html(xn.intval(jfloor.html()) + 1);

    // 回复数 +1
    var jposts = $('.posts');
    jposts.html(xn.intval(jposts.html()) + 1);
}

function myfavourite(tid, ele) {
    var fd = new FormData()
    fd.append("threadid", tid)
    $.ajax({
        url: "/api/v1/thread/"+tid+"/favourite",
        data: fd,
        type: "POST",
        contentType: false,
        processData:false,
        success: function(res) {
            //成功
            console.log(res)
            // return
            if (res.code == 200) {
                if (res.data.action==1) {
                    $(ele).removeClass('js-haya-favorite-add')
                        .addClass('js-haya-favorite-del')
                        .attr('title', '取消收藏');

                    $(ele).find(".icon").removeClass('icon-star-o')
                        .addClass('icon-star')
                        .attr("aria-label", '取消收藏');

                    $(ele).find(".haya-favorite-btn")
                        .text('取消');

                    $(".haya-favorite-show-users").find(".haya-favorite-users").html([]);
                    $(".haya-favorite-user-count").text(res.data.fav_num);
                } else {
                    $(ele).removeClass('js-haya-favorite-del')
                        .addClass('js-haya-favorite-add')
                        .attr('title', '收藏');

                    $(ele).find(".icon").removeClass('icon-star')
                        .addClass('icon-star-o')
                        .attr("aria-label", '收藏');

                    $(ele).find(".haya-favorite-btn")
                        .text('收藏');

                    $(".haya-favorite-show-users").find(".haya-favorite-users").html([]);
                    $(".haya-favorite-user-count").text(res.data.fav_num);
                }
            } else {
                $.alert(res.message)
                return
            }
        }
    })
}


$("#advanced_reply").on("click", function () {
    if ({{.islogin}} && {{.sessions.EmailChecked}} == "0") {
        $.alert("您的邮箱还没有验证，无法回帖")
        return
    }

    location.href = "/thread/{{.thread.ID}}/apost.html"
})


var jsform = $('#search_form');
var jssubmit = $('#searchbutton');

jssubmit.on("click", function () {
    var jkeyword = jsform.find('input[name="keyword"]').val();
    location.href = "/search.html?key="+jkeyword
})
</script>
{{ template "layout/footer" .}}
